<template>
  <div>
    <tree-component-vue :treeData="trees" :expandAll="true" :showCheckBox="true"></tree-component-vue>
    <el-button @click="da">role</el-button>
    <dialog-roles-componet-vue ref="rolediaog"></dialog-roles-componet-vue>
    <el-button @click="org">Orgs</el-button>
    <dialog-org-componet-vue
      ref="Org"
      :showCheckBox="true"
      :expandAll="false"
      @confirmEvent="confirmEvent"
    ></dialog-org-componet-vue>
    <el-button @click="Positions">Position</el-button>
    <dialog-position-componet-vue ref="positions" @confirmEvent="confirmEvent"></dialog-position-componet-vue>

    <el-button size="mini" type="primary" @click="submitUpload">Upload</el-button>
    <dialog-file-upload-componet-vue ref="fileUpload"></dialog-file-upload-componet-vue>
      <dialog-photo-componet-vue></dialog-photo-componet-vue>
  </div>
</template>
<script>
import DialogOrgComponetVue from "../components/DialogOrgComponet.vue";
import DialogPositionComponetVue from "../components/DialogPositionComponet.vue";
import DialogRolesComponetVue from "../components/DialogRolesComponet.vue";
import TreeComponentVue from "../components/TreeComponent.vue";

import reqVue from "../utils/req.vue";
import DialogFileUploadComponetVue from "../components/DialogFileUploadComponet.vue";
import DialogPhotoComponetVue from '../components/DialogPhotoComponet.vue';

let windowHeight = parseInt(window.innerHeight);
export default {
  components: {
    TreeComponentVue,
    DialogRolesComponetVue,
    DialogOrgComponetVue,
    DialogPositionComponetVue,
    DialogFileUploadComponetVue,
    DialogPhotoComponetVue
  },
  data() {
    return {
      trees: [],
      windowHeight: windowHeight,
      autoHeight: {
        height: ""
      },
      outHeight: {
        height: ""
      }
    };
  },
  mounted() {
    window.addEventListener("resize", this.getHeight);
    this.getHeight();
  },
  created() {
    reqVue.$Post(null, "menu/v1.0/tree").then(
      function(data) {
        this.trees = data.body;
        console.log("tag", data.body);
      }.bind(this)
    );
  },
  methods: {
    getHeight() {
      this.outHeight.height = windowHeight - 70 + "px";
    },
    da() {
      this.$refs.rolediaog.paramters = {
        fieldKey: { selectType: 1 },
        data: {}
      };
      this.$refs.rolediaog.dialogRoleTableVisible = true;
      this.$refs.rolediaog.InitTable(null);
    },
    org() {
      this.$refs.Org.dialogOrgVisible = true;
      this.$refs.Org.InitData();
    },
    Positions() {
      this.$refs.positions.dialogPosVisible = true;
      this.$refs.positions.InitData();
      this.$refs.positions.paramters = {
        fieldKey: { selectType: 1 },
        data: {}
      };
    },
    confirmEvent(item) {
      if (item != undefined && item != null) alert(JSON.stringify(item));
    },
    submitUpload() {
      this.$refs.fileUpload.dialogFileUploadVisible = true;
      this.$refs.fileUpload.InitTable("6,7,8,9");
    },
    customUpload(file) {
      alert(JSON.stringify(file));
    }
  }
};
</script>
